<div class="chart-wrapper">
    <div class="chart-main">
        <div class="title">
            图表
        </div>
        <div class="content">
            <p>请选择需要展示的图表类型:</p>
            <nz-radio-group [(ngModel)]="chartType">
                <label nz-radio nzValue="pie">饼图</label>
                <label nz-radio nzValue="bar">柱状图</label>
                <label nz-radio nzValue="stacks">堆叠图</label>
            </nz-radio-group>
            <p>字段选择:</p>
        </div>
        <div class="transfer">
            <nz-transfer [nzListStyle]="{'fontSize':'12px'}"
                         [nzDataSource]="list"
                         [nzTitles]="['编号', '字段']"
                         [nzRender]="render"
                         (nzChange)="transferChange($event)">
            </nz-transfer>
            <ng-template #render let-item><i nz-icon nzType="{{ item.icon }}"></i> {{ item.title }} </ng-template>
        </div>
        <div class="button-group">
            <button nz-button nzType="primary" [nzLoading]="submitLoading" (click)="fetchLayerAttr()">确定</button>
            <div style="width: 40px;display: inline-block"></div>
            <button nz-button nzType="default" (click)="clear()">清除</button>
        </div>
    </div>
</div>
<div *ngFor="let i of elementDivs" id="{{i.id}}" class="chart"></div>
